<div class="col-md-4" *ngFor="let game of games">
  <div class="card text-center">
    <div
      class="card-header bg-dark text-white d-flex justify-content-between align-items-center"
    >
      {{ game.title }}
      <button class="btn btn-danger" (click)="deleteGame(game.id)">
        <i class="far fa-trash-alt"></i>
      </button>
    </div>
    <img class="card-img-top" [src]="game.image" />
    <div class="card-body">
      <p>{{ game.description }}</p>
      <p>Created At {{ game.created_at | date: "yyyy-MM-dd" }}</p>
      <a [routerLink]="['/games/edit', game.id]" class="btn btn-info btn-block">
        EDIT GAME
      </a>
    </div>
  </div>
</div>
